<template>
	<z-paging ref="paging" v-model="dataList" @query="queryList" :auto="false"
		:loading-more-custom-style="{ paddingBottom: 'env(safe-area-inset-bottom)' }">
		<view slot="top" class="zpagin_top">
			<nav-bar :iconLeft="true" />
			<view class="search">
				<text class="text1">调出仓库</text>
				<uni-data-select style="z-index: 1;" placeholder="请选择仓库" v-model="out_warehouse_id" :localdata="warehouse_list"
					@change="typeChange" />
			</view>
		</view>

		<FlyBall ref="flyBall" />
		<uni-card v-for="(item, index) in dataList" :key="item.id" margin="5px" spacing="0">
			<template v-slot:title>
				<uni-list>
					<uni-list-item :title="item.s_name" :note="item.s_code" thumbSize="lg">
						<template v-slot:footer>
							<view :id="`goods-btn${index}`">
								<u-button type="primary" size="small" shape="circle" text="添加" @click="hanldAddWar(index, item)"
									:disabled="isInTransfer(item.id)"></u-button>
							</view>
						</template>
					</uni-list-item>
				</uni-list>
			</template>
			<view class="ctent">规格：{{ item.s_specification }}</view>
			<view class="ctent">库存/基本单位：{{ item.s_inventory }}/{{ item.s_unit_main }}</view>
		</uni-card>
		<template #bottom>
			<view class="zhanwei"></view>
			<view class="car-jiesuan" @click="popupShow = !popupShow">
				<view class="fotter-icon">
					<image class="cartIcon" :animation="cartShakeAnim" src="@/static/adjust_icon_01.png"></image>
				</view>
				<view class="fotter-texts">
					<u--text type="info" :text="`货品数量：${transfer_list.length}`"></u--text>
					<u--text type="info" :text="`调拨数量：${warNum()}`"></u--text>
				</view>
				<view class="fotter-btn" :class="{ btnBgc: transfer_list.length }" v-show="popupShow" @click.stop="dbBtn">调拨
				</view>
				<view style="margin-left: auto;" v-show="!popupShow"><u--text text="点击查看" type="primary" suffixIcon="eye"
						iconStyle="font-size: 40rpx;color:#3c9cff" /></view>
			</view>
			<custom-popup :popupShow="popupShow" mode="bottom" :title="'调入仓库'" class="car-popup-custom"
				@close="popupShow = false" height="70vh">
				<z-paging v-if="popupShow" ref="paging_transfer" :refresher-enabled="false" :loading-more-enabled="false" :fixed="false"
					v-model="transfer_list" @query="queryList_transfer">
					<template #top>
						<view class="zpagin_top">
							<view class="search">
								<uni-data-select style="z-index: 50;" placeholder="请选择仓库" v-model="in_warehouse_id"
									:localdata="warehouse_list" />
							</view>
						</view>
					</template>
					<uni-card v-for="(item, index) in transfer_list" :key="index" margin="5px" spacing="0">
						<template v-slot:title>
							<uni-list>
								<uni-list-item :title="item.s_name" :note="item.s_code" thumbSize="lg">
									<template v-slot:footer>
										<up-icon name="trash" color="red" size="28" @click="removeTransfer(index)" />
									</template>
								</uni-list-item>
							</uni-list>
						</template>
						<view>名称：{{ item.s_name }}</view>
						<view class="ctent">编号：{{ item.s_code }}</view>
						<view class="ctent">规格：{{ item.s_specification }}</view>
						<view class="con">
							<view class="ctent">库存/基本单位：{{ item.s_inventory }}/{{ item.s_unit_main }}</view>
							<custom-num-box v-model="item.transfer_qty" :min="1"></custom-num-box>
						</view>
					</uni-card>
					<template #bottom>
						<view class="zhanwei"></view>
					</template>
				</z-paging>
				<u-modal :show="show" title="调拨原因" showCancelButton @cancel="show = false" @confirm="confirm"
					:asyncClose="true">
					<uni-easyinput type="textarea" v-model="reason" placeholder="请输入调拨原因" />
				</u-modal>
			</custom-popup>
		</template>

	</z-paging>
</template>
<script setup>
import { ref, reactive, getCurrentInstance } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import wareInventoryApi from '../../../api/warehouse/ware_inventory'
import { shakeCartIcon, getRectDom } from '@/utils/index.js';
import FlyBall from '@/components/flyBall'


onLoad(option => {
	
	get_warehouse_list()
})


const paging = ref(null);
const dataList = ref([]);
const out_warehouse_id = ref(null)
const in_warehouse_id = ref(null)
const popupShow = ref(false)
//数据请求
function queryList(pageNo, pageSize) {
	const params = {
		page: 1,
		page_size: 99999,
		warehouse__id: out_warehouse_id.value
	}
	wareInventoryApi.get_stock_control(params).then((res) => {
		paging.value.complete(res.results);
	})
}

const transfer_list = ref([])
const reason = ref('')
function confirm() {
	if (!reason.value || !reason.value.trim()) {
		uni.$u.toast('请填写调拨原因')
		return
	}
	const adjust_info = {
		source_id: out_warehouse_id.value,
		objective_id: in_warehouse_id.value,
		desc: reason.value,
		info: JSON.stringify({ adjust_info: transfer_list.value })
	}
	wareInventoryApi.post_stock_adjust(adjust_info).then(res => {
		out_warehouse_id.value = null
		show.value = false
		transfer_list.value = []
		uni.$u.toast('调拨成功')
		paging.value.complete([]);
	})
}

function typeChange(v) {
	transfer_list.value = [];
	if (!v) {
		paging.value.complete([]);
		return
	}
	paging.value.reload();
}

const paging_transfer = ref(null)
function queryList_transfer() {
	paging_transfer.value.complete(transfer_list.value);
}

const warehouse_list = ref([])
function get_warehouse_list() {
	const params = { page: 1, page_size: 99999, if_open: 1 };
	wareInventoryApi.get_warehouse(params).then(res => {
		paging.value.complete([]);
		warehouse_list.value = res.results.map(v => ({
			text: v.name,
			value: v.id
		}))
	})
}

function isInTransfer(id) {
	return transfer_list.value.some(item => item.id === id)
}
function removeTransfer(index) {
	transfer_list.value.splice(index, 1)
}

const show = ref(false)
function dbBtn() {
	if (!in_warehouse_id.value) {
		uni.$u.toast('请选择调入仓库')
		return
	}
	show.value = true
}

const { proxy } = getCurrentInstance()
const cartShakeAnim = ref()
const flyBall = ref({});
async function hanldAddWar(index, item) {
	const dataIndex = `#goods-btn${index}`
	const startRect = await getRectDom(dataIndex, proxy);
	const endRect = await getRectDom('.cartIcon', proxy);
	//小球动画完成回调函数
	flyBall.value.launch(startRect, endRect, () => {
		if (isInTransfer(item.id)) return;
		transfer_list.value.push({ ...item, transfer_qty: 1 });
		cartShakeAnim.value = shakeCartIcon()
	})
}

function warNum() {
	return transfer_list.value.reduce((sum, item) => sum + Number(item.transfer_qty), 0)
}
</script>

<style lang="scss">
.text1 {
	font-weight: 700;
	font-size: 18px;
	color: #0081ff;
}
</style>